<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Login!</title>
    <link rel="StyleSheet" th:href="@{/css/mypetstore.css}" type="text/css" media="screen"/>
    <link rel="StyleSheet" th:href="@{/css/login/login.css}" type="text/css" media="screen"/>

</head>
<body>

    <div class="topblock" th:include="~{common/top}"></div>


<div id="Catalog">
<div class="loginBlock">
    <p  class="notice1">Please enter your username and password.</p>
    <form action="/account/login" method="post" class="form">
        <script>
            window.onload=function(){
                document.getElementById("img").onclick=function(){
                    this.src = "verify?time=" + new Date().getTime();
                }
            }
        </script>
        <div class="inputBlock">
        <table>
            <tr>
                <td>Username:</td>
                <td><input type="text" name="username" th:value="j2ee" /></td>
            </tr>
            <tr>
                <td>Password:</td>
                <td><input type="password" name="password" th:value="j2ee" /></td>
            </tr>
            <!--<tr>
                <td>Verification Code:</td>
                <td><input type="text" name="verificationCode" /></td>
                <td><a th:href="@{account(pre='login')}"><img id="img" th:src="@{verifyCode}" alt=""></a></td>
            </tr>-->
        </table>
        </div>
        <div class="btn1"><input class="loginBtn" type="submit" value="Login"></div>
    </form>
<div class="registerBlock">
    <p class="notice2">Need a username and password?</p>
    <a class="notice3" th:href="@{/account/registerView}">Register Now!</a>
</div>
</div>
    <div th:include="~{common/bottom}"></div>
</div>
</body>
</html>